<template>
  <div class="about">
    <h1>This is  an about page</h1> 
    <div class="padding bg-white">
	<div class="flex flex-wrap">
		<div class="basis-xs bg-grey margin-xs padding-sm radius">xs(20%)</div>
		<div class="basis-df"></div>
		<div class="basis-sm bg-grey margin-xs padding-sm radius">sm(40%)</div>
		<div class="basis-df"></div>
		<div class="basis-df bg-grey margin-xs padding-sm radius">df(50%)</div>
		<div class="basis-lg bg-grey margin-xs padding-sm radius">lg(60%)</div>
		<div class="basis-xl bg-grey margin-xs padding-sm radius">xl(80%)</div>
	</div>
</div>
  </div>
</template>
